.tab-bar{display: -webkit-box; display: -webkit-flex; display: flex; background-color:#fff; border-bottom: 1px #f5f5f5 solid; height: 44px; line-height:44px; padding: 0; position: fixed; top: 0; width: 100%; z-index: 999;}
.tab-bar div{-webkit-box-flex: 1; -webkit-flex: 1; flex: 1;font-size:1.1em; text-align:center;position:relative; display:block; color: #666}
.tab-bar div.active{color: #000; font-weight: bold;}

/*筛选搜索*/
.searchTopBar{height: 46px; padding: 6px 12px; box-sizing: border-box}
.indexSearch{height: 28px; line-height: 28px; background: #fff; border-radius: 12px; text-align: center; margin-top: 3px;} 
.indexSearch i{display: inline-block;} .indexSearch input{width: 100%; height: 28px; text-align: center; color: #fff;} 
.indexSearch input::placeholder{color: #fff;}

/* 筛选切换 */
.searchLeftTab{float: left; width: 124rpx;}
.searchLeftTab ul li{width: 62px; text-align: center; line-height: 42px; display: inline-block}
.searchLeftTab ul li.active{background: #fff}

.searchRight{position: absolute; top:46px; right: 0; left: 124rpx; bottom: 88rpx; background: #fff; overflow-y: auto}

/* 选择的条件 */
.searchCheck{padding: 2px 0 2px 10px}
.searchCheck li{display: inline-block; padding: 0 24px 0 6px; border-radius: 4px; height: 26px; line-height: 26px; background: #ddd; margin:6px; position: relative; font-size: 11px}
.searchCheck li:before{content: 'x'; width: 16px; height: 16px; text-align: center; line-height: 14px; background: #fff; border-radius: 50%; position: absolute; top: 4px; right: 4px}

/* 条件列表 */
.categoryList{padding: 0 10px; margin-top: 10px}
.categoryList h2{border-bottom: 1px #EDEDED solid; font-weight: bold; line-height: 38px}
.categoryList h2 img{width: 18px; height: 18px; margin-right: 5px; margin-top: 2px}
.categoryList ul{overflow: hidden}
.categoryList ul li{line-height: 30px; height: 30px; margin-top: 6px; padding-left: 10px; float: left; width: 50%; box-sizing: border-box;-webkit-box-sizing: border-box;}
.categoryList ul li.active{background: -webkit-linear-gradient(left, #bbbbbb, #ffffff);}

.categoryBottomBtn{position: absolute;left:0;bottom:0;right:0;text-align: center; border-top:1px #dcdcdc solid;}
.categoryBottomBtn div{width: 50%;float: left;height: 40px;line-height: 40px; background-color: #fff}
.categoryBottomBtn div:last-child{background: #000; color: #fff}

/* 品牌列表 */
.hotBrand {
  padding: 20 rpx;
  overflow: hidden
}

.hotBrand h2 {
  color: #333;
  font-size: 14px;
  margin-left: 16px;
  margin-top: 5px;
}

.hotBrand ul li {
  font-size: 11px;
  padding: 2% 16px;
  height: 38px;
  overflow: hidden;
  position: relative;
  align-items: center;
  text-overflow: ellipsis;
  display: -webkit-flex;
  display: flex;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  width: 50%;
  float: left;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
}

.hotBrand ul li.brandCheckOn:before {
  right: 10px;
}
.searchBrandList{margin-right: 20px}
.searchBrandList, .hotBrand ul li {
  font-family: 'FuturaStd';
}

.searchBrandList ul h2 {
  padding: 5px 16px;
  font-size: 1.3em;
}

.searchBrandList ul li {
  padding: 2% 16px;
  overflow: hidden;
  position: relative
}

.searchBrandList ul li.brandCheckOn {
  background: -webkit-linear-gradient(left, #bbbbbb, #ffffff);
}

.searchBrandList ul li.brandCheckOn:before {
  right: 4px;
}

.brand-letter {
  position: fixed;
  top: 46px;
  right: 0;
  bottom: 50px;
  width: 24px;
  text-align: center;
  display: -webkit-flex;
  display: flex;
  justify-content: center;
  -webkit-box-align: center;
  flex-direction: column;
  align-items: center;
  background-color: #fff;
}

.brand-letter span {
  width: 100%;
  font-size: 10px;
  width: 20px;
  height: 18px;
  line-height: 18px;
  border-radius: 50%
}

.brand-letter span:active, .brand-letter span.active {
  background-color: #000;
  color: #fff
}

/*价格区间*/
.screenPriceList {
  padding: 10px;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
}

.screenPriceList h2 {
  font-weight: bold;
  line-height: 38px
}

.screenPriceListTop {
  background: #D2D2D2;
  padding: 3px;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  border-radius: 4px;
  position: relative;
  overflow: hidden
}

.screenPriceListTop input {
  width: 128px;
  height: 30px;
  text-align: center;
  background: #ffffff;
  border-radius: 3px;
  float: left;
}

.screenPriceListTop input:last-child {
  float: right
}

.screenPriceListTop:after {
  content: '';
  width: 20px;
  height: 3px;
  background: #000;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -1px 0 0 -10px;
}

.screenPriceListBottom {
  margin-top: 6px;
  padding: 0 10px
}
.loginBG{
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: url("http://ssfk-media01.oss-cn-shenzhen.aliyuncs.com/platform/1540180114115.jpg/bg_login.jpg");
  background-size: cover;
}

/* 商品详情 */
.designerName{font-size: 1.1em; font-family: 'FuturaStd'; height:24px; line-height: 24px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.productName{height:20px; line-height: 20px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.productprice{height:20px; line-height: 20px; margin-top: 2px} /*现价*/
.showPrice{font-family: 'FuturaStd'; font-size: 1.1em}
.calculationPrice{margin-left: 4px; font-size: .8em; color: #969797} /*人民币*/

.productpriceDellabel{height:18px;  font-size: .8em; display: block} /*原价 and 折扣*/
.productpriceDellabel del{display: inline-block; text-decoration: line-through;}
.productpriceDellabel .discount{margin-left: 6px;}

.product_price{font-size: 1.1em}
.product_price del{font-size: 0.8em; color: #999; padding-right: 10px; line-height: 100%; display: inline-block}
.product_price b{font-size: 18px}

.Pstate{position: absolute; top:50%; left:50%; width:80px; height:80px; line-height: 80px; font-size:.8em; text-align: center; color: #fff; background-color:rgba(0,0,0,.5); border-radius:50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); z-index: 99}
.product-collectionBtn{position: absolute; top: 5px; right: 5px; width: 44px; height: 44px; line-height: 44px; text-align: center; z-index: 99;}
.product-collectionBtn i{ font-size: 22px; }
.product-collectionBtn.red .iconfont{color: #ff4545}

.product-title{padding:2% 4%; text-align: center; margin-bottom: 6%}
.product-title .productName{font-size: 1em; line-height: 24px; height: 24px}
.product-title h2{font-size: 1.4em;}
.product-title h2, .product-title h3, .product-title p{margin-top: 4px}
.product-title p{font-family: 'FuturaStd';}
.product-title p span{margin-left: 10px; display: inline-block}
.product-title .product_price b{font-weight: normal; display: inline-block}

.product-size{padding:0 12px; border: 1px #ddd solid; margin-top: 12px; line-height: 34px; display: inline-block}
.product-size i{vertical-align: middle; display: inline-block}

.product-block{padding:0 4%; margin-bottom: 6%}
.product-blockTitle{line-height: 34px; font-size: 1.2em; font-weight: bold}

.tax_declaration{ color: #666; font-size: .9em}

.product-brand{height: 44px; line-height: 44px; border-top: 1px #000 solid; overflow: hidden; padding: 0 4%}
.product-brand h2{font-family: 'FuturaStd'; float: left}
.product-brand i{float: right}

.instructionsBox{border-top: 1px #000 solid}
.instructions{padding:2% 4%; text-align: center}
.instructions h2{display: inline-block; padding: 4px 10px; border: 1px solid #000;}
.instructions img{width: 100%; margin-top: 10px}
.instructions p{text-align: left; margin-top: 10px}

.posiHeight{width: 100%; height: 40px;}
.product-contact{display: flex; display: -webkit-flex; border-top: 1px #000 solid;}
.product-contact dl{flex: 1; -webkit-flex:1; text-align: center; padding: 4px 0; position: relative;}
.product-contact dl button{position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0;}
.product-contact dl:first-of-type{border-right: 1px #000 solid}
.product-contact dt{font-size: 1.1em; font-weight: bold}
.product-contact dt i{vertical-align: middle; display: inline-block}
.product-contact dd{color: #999; font-size:.8em}

.posiBottomBtn{position: fixed;left:0;bottom:0;right:0;text-align: center; border-top:1px #000 solid; display: flex; display: -webkit-flex}
.posiBottomBtn .BottomBtn{flex: 1; -webkit-flex:1;  height: 40px;line-height: 40px; background-color: #fff}
.posiBottomBtn .BottomBtn:last-child{background: #000; color: #fff}
.posiBottomBtn .BottomBtn.disabled{background-color: #999; color: #fff;}

/*商品列表*/
.productNum{text-align: center; line-height: 40px}
.product-list{background-color: #fff; min-height: 480px; overflow: hidden; margin-top: 44px}
.product-list dl{float: left; padding:6px 15px; width:50%; position: relative; text-align: center; box-sizing: border-box; -webkit-box-sizing: border-box;}
.product-list dl dt{text-align: center; position: relative; display: flex; display: -webkit-flex; }
.product-list dl dt img{position: absolute; height:100%; width: 100%;}
.product-list dl dt span{position: absolute; top: 0; right: 0; width: 40px; line-height: 40px; text-align: center; z-index: 9;}
.product-list dl dt span .iconfont{color: #cbcbcb; font-size: 18px}
.product-list dl dt span.red .iconfont{color: #ff4545}
.product-list dl dt:after{ content: " "; padding: 50% 0; width:100%; display: inline-block;}
.product-list dl dd{min-height: 86px}

/*购物袋 收银台 底部栏*/
.cashier-bottom-bar{background: #fff; width: 100%; height: 50px; line-height: 50px; position: fixed; bottom: 0; z-index: 999; display: flex; display: -webkit-flex; }
.shoppingcart-bar-left{flex: 5; -webkit-flex:5; padding-left: 14px; box-sizing: border-box;-webkit-box-sizing: border-box;}
.cashier-bottom-bar button{flex: 2; -webkit-flex:2; line-height: 50px; height: 50px; background-color: #000; color: #fff}
.cashier-bottom-bar button:disabled{background: #a3a3a3}

/*
按钮三种不同的状态
*/
.button-state-black_normal{background: black;color:white;height: 36px;text-align: center;line-height: 36px}
.button-state-white_normal{background: white;color:black;height: 36px;text-align: center;line-height: 36px}
.button-state-press{background: #eee;color:#999999;height: 36px;text-align: center;line-height: 36px}
.button-state-disenable{background: #eee;color:#999999;height: 36px;text-align: center;line-height: 36px}

/*订单*/
.ordernu{background: #fff; padding: 2% 4%;}
.ordernu font{float: right; font-size: 1.1em;}
.order-list-box{margin-top: 12px;}
.order-list-box h4{padding: 3% 4%; background: #fff; font-size: 1em; border-bottom: 1px #f5f5f5 solid;}
.order-list-box h4 font{float: right;}
.order-list-di{padding: 0 4% 3%; background: #fff;}
.order-list-di .distri{border-bottom: 1px #f5f5f5 solid; padding: 8px 0; margin-bottom: 5px; overflow: hidden;}
.order-list-di .distri span{float: right; text-align: right;}
.order-list-di .distri span font{color: #666; font-size: 0.8em; display: block;}
.order-list-di ul li{line-height: 1.8em; color: #666; font-size: 0.8em;}
.order-list-di ul li span{float: right;}
.order-list-di ul li.diTotal{font-size: 1em; color: #000; text-align: right; font-weight: bold;}
.order-list-di ul li.diTotal span{padding-left: 10px; color: #ff4545;}
.order-list-di ul li .icon-wen{font-size: 14px;}
.order-list-num{padding: 2% 4%; background: #fff; margin-top: 10px; position: relative;}
.order-list-num p{line-height: 24px; font-size: 0.8em; color: #999;}
.order-list-num input{color: #999;}
.order-list-num p b{display: inline-block}
.copyBtn{border: 1px #9a9a9a solid; padding: 2px 4px; color: #9a9a9a; font-size: 0.8em; position: absolute; top: 10px; right: 10px;}
.order-list{background: #fff; padding: 0 4%;}
.order-list:last-child{margin-bottom: 0;}
.order-list dl{padding: 2% 0; overflow: hidden; position: relative; border-bottom: 1px #f5f5f5 solid;}
.order-list dl dt{float: left; margin-top: 2%; position: relative;}
.order-list dl dt img{width: 66px; height: 66px;}
.order-list dl dd{float: left; margin-left: 6%; line-height: 1.2em; margin-top: 2%; width: 44%;}
.order-list dl dd p{font-size: 0.9em; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.order-list dl dd h2{font-family: 'FuturaStd'; line-height: 1.4em; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;}
.order-list dl h3{text-align: right; position: absolute; right: 4%; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%);}
.order-list dl h3 font{display: block; color: #6e6e6e;}
.order-list dl.gray dt img{opacity: 0.5;}
.order-list dl dt font{padding: 2px 6px; font-size: 0.8em; color: #fff; background: #000; position: absolute; top: 36%; left: 14%;}
.no-b-m{margin-top: 0; margin-bottom: 2%;}
.orderde-btn{padding: 2% 4%; text-align: right; overflow: hidden;}
.orderde-btn font{width: 80px; height: 28px; line-height: 28px; border: 1px #636363 solid; background: #fff; margin: 2% 0 2% 8px; font-size: 0.8em; display: inline-block; text-align: center}
.orderde-btn font:active{border-color: #000;}
.orderde-btn font.bgf0{background: #000; color: #fff;}

.orderde-btn .paybtn{background: #000; color: #fff; height: 28px; line-height: 28px; padding: 0 6px; margin: 2% 0; float: right; font-size: 0.8em; margin-left: 8px;}
.refund-btn{position: absolute; bottom: 0; width: 100%; height: 48px; line-height: 48px; background: #000; color: #fff; text-align: center}
.orderTab{padding-top: 10px;}
.orderTab a{padding: 2px 14px; margin-left: 16px; display: inline-block; border-radius: 16px; background: #fff; border: 1px #999 solid;}
.orderTab a.active{background: #000; color: #fff; border: 1px #000 solid;}
.orderde-btn input.confirm{background: #000; color: #fff;}
.orderde-btn input.confirm:active{background: #000;}
.order-settle{padding: 2% 0; overflow: hidden; background: #fff;}
.order-countdown{float: left; color: #fff; margin-right: 5px; font-size: 0.8em;}

.orderdetails-countdown{padding:5% 0; text-align: center; background: #faf9f7; font-size: .9em}
.orderdetails-countdown b{display: block; font-size: 1.2em;}
.orderdetails-countdown font{padding: 0 4px;}

.orderdetails-state{padding: 3% 4%; background: #fff; margin-bottom: 10px; position: relative;}
.orderdetails-state .icon-xiayige{position: absolute; right:6px; color:#767676; font-size:22px; top:50%; -webkit-transform: translateY(-50%); transform: translateY(-50%);}
.orderdetails-state dl{width:100%; display: -webkit-box; display: -webkit-flex; display: flex;}
.orderdetails-state dl dt{float: left; width: 44px; text-align: center;}
.orderdetails-state dl dt i{font-size: 21px; color: #000}
.orderdetails-state dl dd{-webkit-box-flex: 1; -webkit-flex: 1; flex: 1;}
.orderdetails-state dl dd h2{font-size: 1.1em; line-height: 1.4em}
.orderdetails-state dl dd h2 font{color: #ff4545}
.orderdetails-state dl dd h3{font-size: .8em}
.orderdetails-state .remark{border-top: 1px #dcdcdc solid; margin-top:8px; line-height: 1.4em; padding-top: 8px; padding-left: 44px; }
.orderdetails-state .remark font{color: #000}
.orderdetails-state .remark span{color: #a0a0a0}
.urgeBtn{width:68px; height:28px; padding:0; background:#000; color:#fff; margin:3% 5% 0 0; font-size: .8em}
.urgeBtn.bg-dd{background: #ddd}
#order-wuliu span{font-size: .9em; color: #ff4545; margin-left: 8px}
#order-wuliu h2{margin-bottom: 4px}
#order-wuliu h3{margin-top:0; font-size: .9em;}

.refundText{background: #fff; padding: 3%}

.orderdetails-totaled{border-top: 1px #f5f5f5 solid; padding:2% 4%; overflow: hidden; background: #fff}
.orderdetails-totaled span{float:right}

.no-bg{background: none; border: none}

.order-list dl.service-order{border-bottom: 1px #f2f2f2 solid; padding: 2% 0}
.order-list dl.service-order:last-child{border:none}
.order-list dl.service-order dt img{width: 88px; height:88px}
.order-list dl.service-order dd{width:60%}
.order-list dl.service-order dd p{line-height:1.6em; font-size: 1em}

.order-price{margin-top:12px; padding:2% 2%; background: #fff;}
#other-orders{padding:6px 0; background: #fff; width:60%; margin:20px auto; display: block; text-align: center; color: #ff4545}

/*查看物流 20181106*/
.logisticsDom{padding: 2% 4%; background-color: #fff; margin-top:10px; position: relative;}
.logisticsDom h2{font-size: 1.1em; line-height: 1.4em}
.logisticsDom font{margin-right: 10px}
.logisticsDom h3{color: #666; margin-top:4px}

.logistics{padding: 4%; background: #fff; margin-top: 10px}
.logistics-list{position: relative; overflow: hidden;}
.logistics-list:before {content:''; position:absolute; top:0; left:20px; height:100%; width:1px; background:#ddd; z-index:1}
.logistics-list dl{padding-bottom: 4%; padding-left:46px; overflow: hidden; color: #666}
.logistics-list dl dt{width:9px; height:9px; float:left; background: #ddd; border-radius:50%; margin-left:-29px; margin-top:.4em; position: relative; z-index: 4}
.logistics-list dl dt i{display: none}
.logistics-list dl.current,.logistics-list dl.current p{color: #ff4545;}
.logistics-list dl.current dt{width:20px; height:20px; background: #ff4545;margin-left:-35px; margin-top:0; text-align: center;}
.logistics-list dl.current dt i{color: #fff; font-size: 12px; position: relative; top:2px; display: block;}

.logistics-list dl dd{float:left}
.logistics-list dl dd p{font-size: .9em; color: #848482; margin-top:4px}

/*优惠券*/
.coupons-list{padding:1% 4% 4%; margin-top: 44px}
.coupons-list dl{border:1px #000 solid; overflow: hidden; margin-top:4%; background-color: #fff; position: relative;}
.coupons-list dl dt{float: left; width:60%; border-right: 1px #000 dashed; padding: 0 0 3% 3%; margin: 3px 0}
.coupons-list dl dt h2{font-size:3em; margin: 8% 0 0 0; height:34px; font-weight: bold; line-height: 100%}
.coupons-list dl dt h2 font{font-size: .6em; margin-right: 6px}
.coupons-list dl dt h3{margin-top: 10px; font-size: .8em; line-height: 1.2em}
.coupons-list dl dt h4{color: #aeaeae; font-size: .7em; margin-top: 2px}
.coupons-list dl dd{text-align:center; position: absolute; right:0; width:40%; top:50%; -webkit-transform: translateY(-50%); transform: translateY(-50%);}
.coupons-list dl dd h2{font-size:1.1em; color:#000; font-weight: bold; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.coupons-list dl dd h3{color: #ff4545; font-weight: bold; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

.themes-btn-bg.coupons-btn{width: 92%; margin: 4% 4% 0}

.coupons-list dl.notavailable{border: 1px #a3a3a3 solid;}
.coupons-list dl.notavailable *{color: #979797}
.coupons-list dl.notavailable dt{color: #979797; border-right: 1px #a3a3a3 dashed;}
.coupons-list dl.notavailable dd h2,.coupons-list dl.notavailable dd h3{color: #979797}

.coupons-list dl.checkbox span{position: absolute; top:4px; right:4px}
.coupons-list dl.checkbox input[type="checkbox"] + label span{background-position: 0 -44px;}
.coupons-list dl.checkbox input[type="checkbox"]:checked + label span{background-position: 0 -22px;}

.coupons-code{padding: 16% 12%}
.coupons-code input[type="text"]{border-bottom: 1px #000000 solid; line-height: 40px; background: none; width: 100%; margin-bottom: 30px}
.hotCountry h3{
  font-weight: bold;
  color: #999;
  margin: 10px 15px;
}
.hotCountry ul{
  background-color: #fff;
  overflow: hidden;
  padding: 2% 0;
}

.hotCountry li{
  width: 25%;
  text-align: center;
  line-height: 2.6em;
  float: left;
}

.country-letter {
  position: fixed;
  top: 44px;
  right: 0;
  bottom: 50px;
  width: 24px;
  text-align: center;
  display: -webkit-flex;
  display: flex;
  justify-content: center;
  -webkit-box-align: center;
  flex-direction: column;
  align-items: center
}


.country-letter span {
  width: 100%;
  font-size: 10px;
  width: 20px;
  height: 18px;
  line-height: 18px;
  border-radius: 50%
}

.country-letter span:active, .brand-letter span.active {
  background-color: #000;
  color: #fff
}

.footer {
  background: #f5f5f5;
  text-align: center;
  height: 50px;
  line-height: 50px;
  font-size: 14px;
}
